The “Other” C in CSS

SVG Filters — The Crash Course

When it comes to graphical effects on the Web, CSS has already come a long way in the last few years, with the introduction of CSS filters and blend modes a few years back. However, when compared to effects available in graphics editors such as Photoshop and the likes, CSS is still behind, by far. But SVG, on the other hand, is not that far behind. SVG comes with a set of filter primitives that enable you to recreate Photoshop-grade effects in the browser, using a few lines of code. While the syntax and attributes of these filters may seem intimidating and not very friendly at first, once you get a grasp of how they work, you'll have a very powerful tool in your arsenal, that allows you to push the boundaries of what is possible on the Web. In this talk, Sara is going to give you a crash course on SVG filters — why they are awesome, how they work, and examples of powerful effects you can create with them, in an friendly, easy-to-follow approach. Brace yourself, and get ready to set your imagination free and expand your creativity for what's possible on the Web today.